<template>
  <div class="tale-toolbar">
    <div class="tale-toolbar-left">
      <t-space :size="[10, 10]" break-line>
        <slot name="toolbarLeft"></slot>
      </t-space>
    </div>
    <div class="tale-toolbar-right">
      <t-space :size="[10, 10]" break-line>
        <slot name="toolbarRight"></slot>
      </t-space>
    </div>
  </div>
</template>

<script setup lang="ts">

</script>

<style scoped lang="less">
.tale-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 40px;
  margin-bottom: 10px;

  &-left {
    display: flex;
    justify-content: flex-start;
    flex: 1;
  }

  &-right {
    display: flex;
    justify-content: flex-end;
    flex: 1;
  }

}
</style>
